<template>
  <div>
    <a-modal
      v-model="modal2Visible"
      :title="title"
      width="50%"
      centered
      @ok="hspThresholdAdd"
    >
      <a-card style="width: 90%;text-align: center;margin-left: 5%;">
        <a-row>
          <!--          <a-col :span="6">-->
          <!--            <a-checkbox-group-->
          <!--              name="checkboxgroup"-->
          <!--              :options="plainOptions"-->
          <!--              @change="checkbox"-->
          <!--            />-->
          <!--          </a-col>-->
          <a-col :span="24">
            <div style="height: 50px;">
              <span class="pump">泵前压力</span>
              <a-input placeholder="最低阈值" type="number" v-model="bqqValue" style="width: 40%;"/>
              ~
              <a-input placeholder="最高阈值" type="number" v-model="bqgValue" style="width: 40%;"/>
            </div>
            <div style="height: 50px;">
              <span class="pump">泵后压力</span>
              <a-input placeholder="最低阈值" type="number" v-model="bhqValue" style="width: 40%;"/>
              ~
              <a-input placeholder="最高阈值" type="number" v-model="bhhValue" style="width: 40%;"/>
            </div>
            <div style="height: 50px;">
              <span class="pump">过滤器前压力</span>
              <a-input placeholder="最低阈值" type="number" v-model="glqValue" style="width: 40%;"/>
              ~
              <a-input placeholder="最高阈值" type="number" v-model="glhValue" style="width: 40%;"/>
            </div>
            <div style="height: 50px;">
              <span class="pump">过滤器后压力</span>
              <a-input placeholder="最低阈值" type="number" v-model="glqqValue" style="width: 40%;"/>
              ~
              <a-input placeholder="最高阈值" type="number" v-model="glqhValue" style="width: 40%;"/>
            </div>
<!--            <div style="height: 50px;">-->
<!--              <span class="pump">泵控制阀</span>-->
<!--              <a-input placeholder="最低阈值" type="number" v-model="bkqValue" style="width: 40%;"/>-->
<!--              ~-->
<!--              <a-input placeholder="最高阈值" type="number" v-model="bkhValue" style="width: 40%;"/>-->
<!--            </div>-->
<!--            <div style="height: 50px;">-->
<!--              <span class="pump">过滤器后阀</span>-->
<!--              <a-input placeholder="最低阈值" type="number" v-model="hfqValue" style="width: 40%;"/>-->
<!--              ~-->
<!--              <a-input placeholder="最高阈值" type="number" v-model="hfhValue" style="width: 40%;"/>-->
<!--            </div>-->
            <div style="height: 50px;">
              <span class="pump">蓄水池液位</span>
              <a-input placeholder="最低阈值" type="number" v-model="xscqValue" style="width: 40%;"/>
              ~
              <a-input placeholder="最高阈值" type="number" v-model="xschValue" style="width: 40%;"/>
            </div>
<!--            <div style="height: 50px;">-->
<!--              <span class="pump">累计水量</span>-->
<!--              <a-input placeholder="最低阈值" type="number" v-model="ljqValue" style="width: 40%;"/>-->
<!--              ~-->
<!--              <a-input placeholder="最高阈值" type="number" v-model="ljhValue" style="width: 40%;"/>-->
<!--            </div>-->
<!--            <div style="height: 50px;">-->
<!--              <span class="pump">电压</span>-->
<!--              <a-input placeholder="最低阈值" type="number" v-model="dyqValue" style="width: 40%;"/>-->
<!--              ~-->
<!--              <a-input placeholder="最高阈值" type="number" v-model="dyhValue" style="width: 40%;"/>-->
<!--            </div>-->
<!--            <div style="height: 50px;">-->
<!--              <span class="pump">电流</span>-->
<!--              <a-input placeholder="最低阈值" type="number" v-model="dlqValue" style="width: 40%;"/>-->
<!--              ~-->
<!--              <a-input placeholder="最高阈值" type="number" v-model="dlhValue" style="width: 40%;"/>-->
<!--            </div>-->
          </a-col>
        </a-row>
      </a-card>
    </a-modal>
  </div>
</template>

<script>
import {hspThreshold, hspThresholdList, hspThresholdEdit} from '@/api/device'

export default {
  data() {
    return {
      // plainOptions: ['泵前压力', '泵后压力', '过滤器前压力', '过滤器后压力', '泵控制阀', '过滤器后阀', '蓄水池液位', '累计水量', '电压', '电流'],
      modal2Visible: false,
      title: '阀值设置',
      id: '',
      bqqValue: '',
      bqgValue: '',
      bhqValue: '',
      bhhValue: '',
      glqValue: '',
      glhValue: '',
      glqqValue: '',
      glqhValue: '',
      bkqValue: '',
      bkhValue: '',
      hfqValue: '',
      hfhValue: '',
      xscqValue: '',
      xschValue: '',
      ljqValue: '',
      ljhValue: '',
      dyqValue: '',
      dyhValue: '',
      dlqValue: '',
      dlhValue: ''
    };
  },
  methods: {
    setModal1Visible(modal1Visible) {
      this.modal1Visible = modal1Visible;
    },
    init() {
      this.modal2Visible = true
      hspThresholdList().then(res => {
        console.log(res)
        let data = res.result
        if (parseInt(data.total) != 0) {
          this.title = '编辑阀值'
          this.id = data.records[0].id
          this.bqqValue = data.records[0].pumpTop.split('-')[0]
          this.bqgValue = data.records[0].pumpTop.split('-')[1]
          this.bhqValue = data.records[0].pumpRear.split('-')[0]
          this.bhhValue = data.records[0].pumpRear.split('-')[1]
          this.glqValue = data.records[0].filterTop.split('-')[0]
          this.glhValue = data.records[0].filterTop.split('-')[1]
          this.glqqValue = data.records[0].filterRear.split('-')[0]
          this.glqhValue = data.records[0].filterRear.split('-')[1]
          this.bkqValue = data.records[0].pumpConVal.split('-')[0]
          this.bkhValue = data.records[0].pumpConVal.split('-')[1]
          this.hfqValue = data.records[0].filterVal.split('-')[0]
          this.hfhValue = data.records[0].filterVal.split('-')[1]
          this.xscqValue = data.records[0].reservoirLevel.split('-')[0]
          this.xschValue = data.records[0].reservoirLevel.split('-')[1]
          this.ljqValue = data.records[0].cumWater.split('-')[0]
          this.ljhValue = data.records[0].cumWater.split('-')[1]
          this.dyqValue = data.records[0].voltage.split('-')[0]
          this.dyhValue = data.records[0].voltage.split('-')[1]
          this.dlqValue = data.records[0].electricity.split('-')[0]
          this.dlhValue = data.records[0].electricity.split('-')[1]
          // '泵前压力', '泵后压力', '过滤器前压力', '过滤器后压力', '泵控制阀', '过滤器后阀', '蓄水池液位', '累计水量', '电压', '电流'
        }

      }).catch(err => {

      })
    },
    hspThresholdAdd() {
      // ['泵前压力', '泵后压力', '过滤器前压力', '过滤器后压力', '泵控制阀', '过滤器后阀', '蓄水池液位', '累计水量', '电压', '电流'],
      let hspThresholdList = {
        pumpTop: this.bqqValue + '-' + this.bqgValue,
        pumpRear: this.bhqValue + '-' + this.bhhValue,
        filterTop: this.glqqValue + '-' + this.glqhValue,
        filterRear: this.glqqValue + '-' + this.glqhValue,
        pumpConVal: this.bkqValue + '-' + this.bkhValue,
        filterVal: this.hfqValue + '-' + this.hfhValue,
        reservoirLevel: this.xscqValue + '-' + this.xschValue,
        cumWater: this.ljqValue + '-' + this.ljhValue,
        voltage: this.dyqValue + '-' + this.dyhValue,
        electricity: this.dlqValue + '-' + this.dlhValue,
        id: this.title == '阀值设置' ? '' : this.id
      }
      if (this.title == '编辑阀值') {
        hspThresholdEdit(hspThresholdList).then(res => {
          this.$message.success('阀值保存成功！');
          this.modal2Visible = false
        }).catch(err => {

        })
        return false
      }
      hspThreshold(hspThresholdList).then(res => {
        console.log(res)
        this.$message.success('阀值保存成功！');
        this.modal2Visible = false
      }).catch(err => {

      })
    }
    // checkbox(e) {
    //   console.log(e)
    // }
  },
};
</script>

<style scoped>
/deep/ .ant-checkbox-wrapper {
  display: block;
  text-align: left;
  height: 50px;
}

/deep/ .ant-tabs-bar {
  border-bottom: none;
}

/deep/ .ant-card-bordered {
  border: none;
}

.pump {
  width: 120px;
  text-align: left;
  font-size: 14px;
  display: inline-block;
  margin-right: 10px;
}
</style>